<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head lang="en">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="format-detection" content="email=no"/>
    <meta charset="UTF-8">
    <script type="text/javascript" th:src="@{${session.baseUrl}+'js/common.js'}"></script>
    <script th:src="@{${session.baseUrl}+'js/jquery.js'}"></script>
    <link th:href="@{${session.baseUrl}+'style/reset.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/base.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/header.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/dialog.css'}" rel="stylesheet" type="text/css">
    <link th:href="@{${session.baseUrl}+'style/global.css'}" rel="stylesheet" type="text/css">
    <script th:src="@{${session.baseUrl}+'js/dialog.js'}"></script>
    <script th:src="@{${session.baseUrl}+'js/dialogbutton.js'}"></script>
    <link rel="stylesheet" th:href="@{${session.baseUrl}+'style/projectDetail.css'}"/>
    <title>详情</title>
    <style>
        .btn-block {
            position: fixed;

            height: 6%;
            width: 100%;
            bottom: 0.0rem;
            background-color: #2888e5;
            font-size: 0.32rem;
            color: #fff;
            border-radius: 0.1rem;
            align-items: center;

        }

        .header {
            position: fixed;
            width: 100%;
            z-index: 99;
            text-align: center;
            line-height: 0.88rem;
            height: 0.88rem;
            font-size: 0.32rem;
            color: #fff;
            background: #2d9cff;
            top: 0;
        }
        #inputmoney{
            width: 6.5rem;
            line-height: 0.7rem;
            padding-right: .30rem;
            margin-top: .20rem;
            margin-left: .30rem;
            margin-bottom: .20rem;
            background-color: #fff;
            border:0.01rem solid black;


        }
        .btn-block1{
            position: fixed;
            height: 6%;
            width: 100%;
            bottom: 0.0rem;
            background-color: #888888;
            font-size: 0.32rem;
            color: #575757;
            border-radius: 0.1rem;
            align-items: center;
        }
        #msg{
            padding-left: 0.3rem;
            font-size: 0.3rem;
            line-height: 0.4rem;
            padding-bottom: 0.3rem;
            font-weight: bold;
        }
        .exampleImg {

            cursor: pointer;
        }
    </style>
</head>
<body>
<header class="header"><span onclick="javascript:history.go(-1)"></span>项目详情</header>

<!--<input id="projectId" type="hidden" th:value="${drafts.id}">
<input type="hidden" th:value="${drafts.status}">
<input id="memberId" type="hidden" th:value="${session.memberId}">-->

<i th:if="${drafts.type==0}"><img th:src="@{${session.baseUrl}+'images/projectDetail/mingxing.png'}" alt="" style="width: 100%;height: 3.8rem;"/></i>
<i th:if="${drafts.type==1}"><img th:src="@{${session.baseUrl}+'images/projectDetail/youxiu.png'}" alt="" style="width: 100%;height: 3.8rem;"/></i>
<i th:if="${drafts.type==2}"><img th:src="@{${session.baseUrl}+'images/projectDetail/xingjiabi.png'}" alt="" style="width: 100%;height: 3.8rem;"/></i>
<i class="f30 title" th:text="${drafts.name}"></i>
<p>&nbsp;</p>
<ul id="intro">
    <li class="df jcsb pt30 lh50"><b>认购金额</b><b th:text="${memberProject.money}"></b></li>
    <!--买家买入金额-->
    <input id="buymoney" type="hidden"  th:value="${#numbers.formatDecimal(memberProject.money+memberProject.earningsMoney,1,2)}" />
    <li class="df jcsb pt30 lh50"><b>预期收益</b><b th:text="${memberProject.hopeMoney}"></b></li>
    <li class="df jcsb pt30 lh50"><b>收益金额</b><b th:text="${#numbers.formatDecimal(memberProject.earningsMoney,1,2)}"></b></li>
    <li class="df jcsb pt30 lh50"><b>最大转让金额</b><b th:text="${#numbers.formatDecimal(memberProject.money*memberProject.assignmentRate + memberProject.money,1,2)}" id="max"></b></li>
    <li class="df jcsb pt30 lh50"><b>收益截止时间</b><b th:text="${#dates.format(memberProject.endTime, 'yyyy-MM-dd')}"></b></li>
    <li class="df jcsb pt30 lh50"><b>购买时间</b><b th:text="${#dates.format(memberProject.createTime, 'yyyy-MM-dd')}"></b></li>
    <li class="df jcsb pt30 lh50"><b>年化收益率</b><span style="font-size: 0.4rem;color: red;font-weight: bold" th:text="${#numbers.formatDecimal(100*memberProject.rate,1,2)}+'%'"></span></li>
    <li class="df jcsb pt30 lh50"><span style="color: red">温馨提示：未到期项目提前转让，该项目年化收益率按<span style="font-weight: bold;color: red;font-size: 0.3rem" th:text="${#numbers.formatDecimal(100*session.basicTable.assignmentRate,1,2)}+'%'"></span>计算收益。</span></li>
</ul>

<ul class="detail">
    <li>详情介绍</li>
</ul>
<ul class="pb20" style="border-bottom: 0.2rem solid #f2f2f2;" >
    <li>
        <div style="width: 2.5rem;height: 1rem;margin-left: 1rem;" th:if="${drafts.imgOne!=null}">
            <img class="exampleImg" th:src="${drafts.imgOne}" id="imgTest1" style="height: 100%;width: 100%"/>
        </div>
        <div style="width: 2.5rem;height: 1rem;margin-left: 4rem;margin-top: -1rem" th:if="${drafts.imgTwo!=null&&drafts.imgOne!=null}">
            <img class="exampleImg" th:src="${drafts.imgTwo}" id="imgTest2" style="height: 100%;width: 100%"/>
        </div>
        <div style="width: 2.5rem;height: 1rem;margin-left: 2.5rem;" th:if="${drafts.imgTwo!=null&&drafts.imgOne==null}">
            <img class="exampleImg" th:src="${drafts.imgTwo}" id="imgTest3" style="height: 100%;width: 100%"/>
        </div>
    </li>
    <li class=" pl30 pr30 pt30 pb30" id="info" th:text="${drafts.projectIntro}">
    </li>
</ul>

<ul class="detail">
    <li>收益介绍</li>
</ul>
<ul class="pb20" style="border-bottom: 0.2rem solid #f2f2f2;" >
    <li class=" pl30 pr30 pt30 pb30" id="shouyi" th:text="${drafts.projectEarningsIntrox}">

    </li>
</ul>

<ul class="detail">
    <li>风险介绍</li>
</ul>
<ul class="pb20" style="border-bottom: 0.2rem solid #f2f2f2;" >
    <li class=" pl30 pr30 pt30 pb30" id="fengxian" th:text="${drafts.projectRisk}">

    </li>
</ul>
<span th:if="${memberProject.status==1}">
    <span th:if="${memberProject.infoV=='0'}">
        <ul class="detail">
            <li style="color: black;font-weight: bold">请输入转让金额</li>
        </ul>
        <ul class="pb20" style="border-bottom: 0.2rem solid #f2f2f2;" >
            <input id="inputmoney" type="number" th:value="${#numbers.formatDecimal(memberProject.money*memberProject.assignmentRate+memberProject.money,1,2)}"/>
            <br>
            <span id="msg"></span>
        </ul>
    </span>
</span>

<div  style="height: 5rem;background-color: #f2f2f2">
    &nbsp;
</div>

</body>
<footer>
    <span th:if="${memberProject.status==5}"><button type="button"   class="btn-block1" disabled="disabled" style="z-index:9999;">项目已结束</button></span>
    <span th:if="${memberProject.status==1}">
        <span th:if="${memberProject.infoV=='0'}">
            <button type="button" onclick="sub()"  class="btn-block" style="z-index:9999;">转让</button>
        </span>
          <span th:if="${memberProject.infoV=='1'}">
            <button type="button"   class="btn-block1" style="z-index:9999;">不可转让</button>
        </span>
    </span>
    <span th:if="${memberProject.status==3}"><button type="button"   class="btn-block1" disabled="disabled" style="z-index:9999;">转让中</button></span>
    <span th:if="${memberProject.status==2}"><button type="button"   class="btn-block1" disabled="disabled" style="z-index:9999;">已转让</button></span>
</footer>
<script type="text/javascript" th:inline="javascript">
    var basePath = /*[[${#httpServletRequest.getScheme() + "://" + #httpServletRequest.getServerName() + ":" + #httpServletRequest.getServerPort() + #httpServletRequest.getContextPath()}]]*/;

/*
    function init() {
        var strinfo ='';
        strinfo=[[${drafts.projectIntro}]];
        $("#info").append(strinfo); //动态加载插入HTML

        var strshouyi = '';
        strshouyi=[[${drafts.projectEarningsIntrox}]];
        $("#shouyi").append(strshouyi); //动态加载插入HTML

        var strfengxian = '';
        strfengxian=[[${drafts.projectRisk}]];
        $("#fengxian").append(strfengxian); //动态加载插入HTML




    }*/

    function sub() {
        var input =  $("#inputmoney").val();//输入的转让金额
        var span  =  $("#msg");
        var money = [[${memberProject.money}]];//投资金额
        var maxmoney = $("#max").text();//最大转让金额
        var buymoney = $("#buymoney").val();//买家买入金额
        if(input==''){
            span.html('请输入转让金额！').css('color', '#ff2525');
            return false;
        }else if(input>maxmoney){
            span.html('不能大于最大转让金额！').css('color', '#ff2525');
            return false;
        }else if(input<money){
            span.html('不能小于项目认购金额！').css('color', '#ff2525');
            return false;
        }else{
            $('body').dailogbutton({type: 'success', title: '转让', discription: '是否确认转让？'},function(ret) {
                if (ret.index === 0) {
                    $.ajax({
                        url: basePath + "/memberProjectTransfer/add2",
                        contentType: 'application/json',
                        type: "POST",
                        dataType: "json",
                        data: JSON.stringify({
                            transferMemberId: [[${memberProject.memberId}]],
                            memberProjectId: [[${memberProject.id}]],
                            status: 0,
                            transferAmount: input,
                            transferBuyAmount:buymoney,
                        }),
                        success: function (e) {
                            if (e.data) {
                                $('body').dailog({type: 'success', title: '转让', discription: '操作成功，项目正在转让中'});
                                self.setInterval(function () {
                                    location.reload();
                                }, 3000)
                            } else {
                                $('body').dailog({type: 'warning', title: '转让', discription: '操作失败'});
                                self.setInterval(function () {
                                    location.reload();
                                }, 3000)
                            }
                        }
                    })


                } else {
                    location.reload();
                }


            })

        }





    }


   /* $(function(){
        var money=$("#money").html();
        var target=$("#target").html();
        money=money.slice(money.indexOf('￥')+1);
        target=target.slice(target.indexOf('￥')+1);
        console.log(money);
        console.log(target);
        $(".child").css("width",parseInt(money)/parseInt(target)*100+'%')


        if(money==0){
            $("#support").css("background","#aaa");
        }
    });*/

</script>
</html>